<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>用户登录</title>
    <base th:href="${#request.getScheme()}+'://'+${#request.getServerName()}+':'+${#request.getServerPort()}+${#request.getContextPath()}+'/'">
    <link rel="stylesheet" href="/static/css/login.css">
</head>

<body>
    <div class="container">
        <div id="login" class="wrap login-wrap">
            <form action="/api/login" method="POST">
                <span class="title">用户登录</span>
                <div class="item">
                    <input placeholder="用户名" name="userName">
                </div>
                <div class="item">
                    <input placeholder="用户密码" name="userPass" type="password">
                </div>
                <span th:text="${msg}"></span>
                <!-- <div class="item">
                    <input placeholder="验证验" name="userPass" type="password">
                    <img src="img/qr.jpg">
                </div> -->
                <div class="opt">
                    <button type="submit">登录</button>
                    <!-- <button onclick="onRegisterClick(1)" type="button">注册</button> -->
                </div>
            </form>
        </div>
        <!-- <div class="register-wrap wrap">
            <form accept="register.jsp" method="POST">
                <span class="title">用户注册</span>
                <div class="item">
                    <input placeholder="用户名" name="userName">
                </div>
                <div class="item">
                    <input placeholder="用户密码" name="userPass" type="password">
                </div>
                <div class="item">
                    <input placeholder="确认密码" name="userPass" type="password">
                </div>

                <div class="item">
                    <input placeholder="手机号" name="userPass" type="">
                </div>
                <div class="opt">
                    <button type="submit">注册</button>
                    <button onclick="onRegisterClick(2)" type="button">登录</button>
                </div>
            </form>
        </div> -->
    </div>
    <script>
        function onRegisterClick(type) {
            var loginDv = document.getElementsByClassName("login-wrap")[0];
            var registerDv = document.getElementsByClassName("register-wrap")[0];

            if (1 == type) {
                loginDv.style.transform = "rotateY(180deg)";
                registerDv.style.transform = "rotateY(0deg)";
                return;
            }
            loginDv.style.transform = "rotateY(0deg)";
                registerDv.style.transform = "rotateY(-180deg)";
        }
    </script>
</body>

</html>